<template>
	<view class="xzxq">
		<navbar></navbar>
		<textNavbar myprops="协作详情"></textNavbar>
		<view class="xzxq-content" v-for="item in list" :key="item.id">
			<view class="content-top"><text class="text1">{{item.statusname}}</text></view>
			<van-field
				readonly
				label="协作类型"
				:placeholder="item.name1 + '/' + item.name2"
				input-align="right"
			/>
			<van-field
				readonly
				label="协作地区"
				:placeholder="item.province + '-' + item.city"
				input-align="right"
			/>
			<van-field
				readonly
				label="预算金额"
				:placeholder="item.price"
				placeholder-style="color: red;"
				input-align="right"
			/>
			<van-field
				readonly
				label="状态"
				:placeholder="item.statusname"
				input-align="right"
			/>
			<van-field
				readonly
				label="发单时间"
				:placeholder="item.add_time"
				input-align="right"
			/>
			<van-cell title="发单情况" :label="item.content" />
			<view class="aaa" v-if="item.img"> <image :src="item.img" mode=""></image> </view>
			<view class="check" v-if="uid == item.uid">
				<view class="check-vw">
					<view class="check-vw-top">
						<image src="../../../static/头像.png" mode=""></image>
						<text>xxx</text>
					</view>
					<van-radio-group :value="radio" @change="onChange('1')">
					  <van-radio name="1"></van-radio>
					</van-radio-group>
				</view>
			</view>
			<view class="xzxq-btn">
				<view class="xzxq-btn-con1" v-if="uid == item.uid && item.status == 0" @click="chexiao(item.id)">撤销协作</view>
				<view class="xzxq-btn-con2" v-if="uid !== item.uid && item.status == 0" @click="xiez(item.id)">接单</view>
				<!-- <view class="xzxq-btn-con3" v-if="item.status == 0 && item.parent_id !== null && item.user.length > 0" @click="open">支付</view> -->
				<view class="xzxq-btn-con3" v-if="item.status == 0 && item.parent_id !== null && zhif == 0" @click="open">支付</view>
				<view class="xzxq-btn-con2" v-if="uid !== item.uid && item.status == 2" @click="wanc(item.id)">完成协作</view>
				<view class="xzxq-btn-con2" v-if="uid == item.uid && item.status == 3" @click="quer(item.id)">确认完成</view>
			</view>
			<van-dialog
			  use-slot
			  title="标题"
			  :show="show"
			  show-cancel-button
			  confirm-button-open-type="getUserInfo"
			  @close="onClose"
			  @confirm="getUserInfo(item.id)">
			  <view class="ccc">
					<van-field
						:value="price"
						label="价格"
						placeholder="请输入价格"
						@change="ChangePrice"
					/>
				</view>
			</van-dialog>
		</view>
		<van-toast id="van-toast" />
	</view>
</template>

<script>
	import Toast from '@vant/weapp/dist/toast/toast';
	import { coopDetail, getlawyerDetail, diecoop, sendcoop, paycoop, completecoop, confirmcoop, completecoopUser } from '../../../utils/utils';
	export default {
		data() {
			return {
				list: [], // 协作详情数组
				uid: '', // 律师id
				radio: '', // 单选
				show: false, // 弹出框
				price: '', // 价格
				zhif: 0, // 支付按钮
			}
		},
		onLoad(option) {
			console.log(option.id);
			let a = {
				id: String(option.id)
			}
			// 协作详情
			coopDetail(a, (e) => {
				console.log('协作详情', e.data.data);
				this.list.push(e.data.data)
				// console.log(this.list);
			})
			// 律师详情
			getlawyerDetail((e) => {
				console.log('律师详情', e);
				this.uid = e.data.lawyer.id
			})
		},
		methods: {
			// 撤销协作
			chexiao (i) {
				let a = {
					id: String(i)
				}
				diecoop(a, (e) => {
					console.log(e);
					if (e.status) {
						Toast(e.msg)
						setTimeout(() => {
							uni.redirectTo({
								url: "/pages/Attorney side/answerRob/answerRob"
							})
						}, 1500)
					} else {
						Toast(e.msg)
					}
				})
			},
			// 协作
			xiez (i) {
				let a = {
					id: String(i)
				}
				sendcoop(a, (e) => {
					console.log(e);
					if (e.status == 200) {
						Toast(e.msg)
						setTimeout(() => {
							uni.redirectTo({
								url: "/pages/Attorney side/myCollaboration/myCollaboration"
							})
						}, 1500)
					} else {
						Toast(e.msg)
					}
				})
			},
			// 单选
			onChange(event) {
				this.radio = event
				console.log(this.radio);
			},
			// 弹出框确定逻辑
			getUserInfo(i) {
			  // console.log(i);
				if (this.price > 0 && this.radio) {
					let b = {
						id: String(this.radio)
					}
					completecoopUser (b, (res) => {
						if (res.status == 200) {
							this.zhif++
							let a = {
								id: String(i)
							}
							paycoop(a, (e) => {
								if (e.status == 200) {
									Toast(e.msg)
									setTimeout(() => {
										uni.redirectTo({
											url: "/pages/Attorney side/myCollaboration/myCollaboration"
										})
									}, 1500)
								} else {
									Toast(e.msg)
								}
							})
						} else {
							Toast(res.msg)
						}
					})
				} else {
					Toast('您价格没有输入或者协作者没有选取')
				}
			},
			// 关闭弹出框
			onClose() {
				this.show = false
			},
			// 打开弹出框
			open () {
				this.show = true
			},
			// 价格
			ChangePrice (e) {
				this.price = e.detail
			},
			// 完成协作
			wanc (i) {
				let a = {
					id: String(i)
				}
				completecoop (a, (e) => {
					if (e.status == 20) {
						Toast(e.msg)
						setTimeout(() => {
							uni.redirectTo({
								url: "/pages/Attorney side/myCollaboration/myCollaboration"
							})
						})
					} else {
						Toast(e.msg)
					}
				})
			},
			// 确认完成
			wanc (i) {
				let a = {
					id: String(i)
				}
				confirmcoop (a, (e) => {
					if (e.status == 20) {
						Toast(e.msg)
						setTimeout(() => {
							uni.redirectTo({
								url: "/pages/Attorney side/myCollaboration/myCollaboration"
							})
						})
					} else {
						Toast(e.msg)
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.xzxq {
		width: 100vw;
		height: 100vh;
		background-color: #EDEDED;
	}
	.xzxq-content {
		display: flex;
		flex-direction: column;
	}
	.xzxq-content > .content-top {
		height: 30px;
		font-size: 12px;
		color: #959595;
		display: flex;
		align-items: center;
	}
	.content-top > .text1 {
		margin-left: 15px;
	}
	
	.xzxq-btn {
		width: 100vw;
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-top: 20px;
	}
	.xzxq-btn-con1 {
		width: 92%;
		height: 40px;
		background-color: green;
		border-radius: 8px;
		color: white;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 15px;
		margin-bottom: 5px;
	}
	.xzxq-btn-con2 {
		width: 92%;
		height: 40px;
		background-color: #105ae3;
		border-radius: 8px;
		color: white;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 15px;
		margin-bottom: 5px;
	}
	.xzxq-btn-con3 {
		width: 92%;
		height: 40px;
		background-color: #ff0000;
		border-radius: 8px;
		color: white;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 15px;
		margin-bottom: 5px;
	}
	
	
	.aaa {
		width: 100vw;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.aaa > image {
		width: 50px;
		height: 50px;
	}
	
	.check {
		width: 100vw;
		margin-top: 5px;
		display: flex;
		justify-content: center;
	}
	.check-vw {
		width: 92vw;
		display: flex;
		align-items: center;
		justify-content: space-between;
		background-color: white;
		margin-bottom: 5px;
	}
	.check-vw-top {
		display: flex;
		align-items: center;
	}
	.check-vw-top > image {
		width: 30px;
		height: 30px;
	}
	.check-vw-top > text {
		font-weight: bold;
		font-size: 16px;
		margin-left: 20px;
	}
	
	.ccc {
		height: 50px;
	}
</style>
